<template>
  <glsx-dialog :show="value" width="80%" title="选择医院" @close="closeDialog" :appendtobody="true">
    <div>
      <div class="filter_box">
        <el-form :inline="true" size="small" :model="formInline">
          <el-form-item label="城市：">
            <city-select v-model="formInline.cities"></city-select>
          </el-form-item>
          <el-form-item label="关键词：">
            <el-input v-model="formInline.term" placeholder="请输入关键词"></el-input>
          </el-form-item>
          <el-form-item label="">
            <el-button type="primary" size="small" @click="getList">筛选</el-button>
          </el-form-item>
          <el-form-item label="">
            <el-button type="default" size="small" @click="allCheck">全选</el-button>
          </el-form-item>
          <el-form-item label="">
            <el-button type="default" size="small" @click="rest">清空</el-button>
          </el-form-item>
        </el-form>
      </div>

      <el-table class="el_table" :data="hospList" size="small" border max-height="250">
        <el-table-column label="医院信息" prop="name">
          <template slot-scope="{row}">
            <GoodsHospital :info="row"></GoodsHospital>
          </template>
        </el-table-column>
        <el-table-column label="勾选" prop="" width="100">
          <template slot-scope="{row}">
            <el-checkbox v-model="row.checked" @change="onChange"></el-checkbox>
          </template>
        </el-table-column>
      </el-table>

    </div>
    <div class="" slot="footer">
      <el-button type="primary" size="small" @click="saveInfo">保存</el-button>
      <el-button type="default" size="small" @click="closeDialog">取消</el-button>
    </div>
  </glsx-dialog>
</template>
<script>
import GoodsHospital from "@/components/hospital/hospital.vue";
import { GET_HOSPITAL_SEARCHALL } from "@/http/hospital";
import { deepClone } from '@/common/util';
export default {
  name: "ChooseHospital",
  props: {
    value: {
      type: Boolean,
      default: false,
    },
    id: {
      type: [String, Number],
      default: "",
    },
    list: {
      type: Array,
      default: function () {
        return []
      }
    }
  },
  components: {
    GoodsHospital,
  },
  watch: {
    // list: {
    //   handler: function (n, o) {
    //     if (n) {
    //       //this.getInfo(n);
    //       let m = this.hospList || []
    //       m.map(k => {
    //         let idx = n.findIndex(j => j.id == k.id);
    //         console.log(idx)
    //         if (idx >= 0) {
    //           k.checked = true
    //         }
    //         return k;
    //       })
    //       this.hospList = m;
    //     }
    //   },
    //   immediate: true,
    // },
  },
  data() {
    return {
      formInline: {},
      hospList: [],
    };
  },
  created() {
    this.getList();
  },
  methods: {
    // 关闭弹框
    closeDialog() {
      this.$emit("input", false);
      this.currentId = "";
    },

    // 获取参数
    getParams() {
      let o = deepClone(this.formInline);
      o.pageNumber = 1
      o.pageSize = 3000;
      return o
    },

    // 获取列表
    getList() {
      let oParams = this.getParams();
      GET_HOSPITAL_SEARCHALL(oParams).then((res) => {
        let obj = res.data || {};
        let list = obj.list || [];
        let checkList = this.list;
        list.map(k => {
          let idx = checkList.findIndex(j => j.id == k.id);
          console.log(idx)
          if (idx >= 0) {
            k.checked = true
          }else{
            k.checked = false
          }
        })
        this.hospList = list;
      });
    },

    // 清空
    rest() {
      this.formInline = {};
      this.getList()
    },

    // 保存数据
    saveInfo() {
      let list = this.hospList;
      let arr = [];
      list.map((k) => {
        if (k.checked) {
          arr.push(k);
        }
      });
      console.log(arr);
      this.$emit("change", arr);
      this.closeDialog()
    },

    // 全选
    allCheck(){
      let list = this.hospList;
      list.map(k => {
        k.checked = true;
      })
    },

    // 监听勾选操作
    onChange(e){
      console.log(e)
    }

  },
};
</script>
<style lang="scss" scoped></style>